@w-rate:~"w-rate";
.@{w-rate} {
  position: relative;
  line-height: 12px;
  font-size: 20px;
  display: inline-block;
  vertical-align: middle;
  color: #e9e9e9;
  > span +  span {
    margin-left: 3px;
  }
  > span, &-bg {
    position: relative;
    display: inline-block;
  }
  &-hight {
    line-height: 12px;
    position: absolute;
    transition: color .3s, width .3s;
  }
  .hover-on {
    cursor: pointer;
  }
  .star-on, .hover-on {
    color: #f5a623;
  }
  .half-on:not(.hover-on) &-hight {
    width: 50%;
    z-index: 3;
    overflow: hidden;
  }
  .half-on:not(.hover-on) &-bg {
    color: #e9e9e9;
  }
}
